@import './base.css';

* {
	margin: 0;
	padding: 0;
	// font-family: '微软雅黑';
	font-family: PingFangSCRegular;
	/* 用户无法选中文字 */
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

img {
	/* 无法选中图片 */
	pointer-events: none;
	margin: 0;
	width: 100%;
	height: 100%;
	padding: 0;
}

a {
	text-decoration: none;
}

@media (hover: hover) {
	a:hover {
		// background-color: hsla(160, 100%, 37%, 0.2);
	}
}

@media (min-width: 1024px) {
	body {
		font-family: "微软雅黑";
	}
}

.min-max-width {
	min-width: 1200px;
	max-width: 1400px;
	width: 100%;
	margin: 0 auto;
}

/* 单行溢出隐藏显示... */
.thd {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* 多行溢出隐藏显示...不显示 行内样式显示 */
.t2hd {
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: break-all;
}

.box-shadow {
	box-shadow: 0px 3px 6px 1px rgba(85, 85, 85, 0.1);
}

/* 列表为空 暂无数据 */
.none_data {
	color: #999;
	font-size: 14px;
	line-height: 100px;
	width: 100%;
	text-align: center;
}

/* 滚动条 */
::-webkit-scrollbar {
	// display: none; // 隐藏滚动条
	width: 5px;
	height: 5px;
}

::-webkit-scrollbar-track {
	background: #fff;
	border-radius: 2px;
}

::-webkit-scrollbar-thumb {
	// background: rgb(205, 206, 206);
	background: #5173F2;
	border-radius: 50px;
}

::-webkit-scrollbar-thumb:hover {
	background: #333;
}

::-webkit-scrollbar-corner {
	background: #fff;
}

.el-breadcrumb {
	font-size: 16px !important;
}

.el-pagination {
	justify-content: center;
}

.app-deta-box {
	width: 57.16px;
	height: 66px;
	background-image: url("@/assets/img/tzgg-icon.png");
	background-size: 100%;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;

	.day {
		font-weight: bold;
		font-size: 20px;
		color: #0f4e9b;
		transition: 0.5s;
	}

	.year {
		margin-top: -5px;
		font-weight: 500;
		font-size: 10px;
		color: #0f4e9b;
		transition: 0.5s;
	}
}

// 网站导航公共属性
.app-tab {
	display: flex;
	gap: 40px;
	align-items: flex-start;

	&-item {
		position: relative;
		cursor: pointer;
		font-weight: 400;
		font-size: 18px;
		color: rgba(255, 255, 255, 0.8);
		padding: 10px 20px;
		border-radius: 2px;

		.app-tab-underline {
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			bottom: 0;
			width: 0%;
			height: 2px;
			border-radius: 100px;
			transition: .3s;
			background-color: white;

			&.active {
				width: 100%;
				left: 0;
				transform: translateX(0%);
				background-color: white;
			}
		}

		&:hover {
			color: white;
			background: rgba(255, 255, 255, 0.1);

			.app-tab-underline {
				width: 100%;
				left: 0;
				transform: translateX(0%);
			}
		}

		&.active {
			color: #FFFFFF;

			.app-tab-underline {
				width: 100%;
				left: 0;
				transform: translateX(0%);
			}
		}
	}
}

// 页面导航公共属性
.app-tab2 {
	display: flex;
	gap: 60px;
	font-size: 24px;
	display: flex;
	align-items: center;
	padding: 0 20px;
	// height: 54px;
	line-height: 55px;
	// border-bottom: 1px solid #F3F3F3;

	&-item {
		position: relative;
		cursor: pointer;
		min-width: 60px;
		text-align: center;
		font-weight: 400;
		color: #666666;
		border-radius: 2px;

		.app-tab-underline {
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			bottom: 0;
			width: 0%;
			height: 2px;
			border-radius: 100px;
			transition: .3s;
			background-color: #0B5EB2;

			&.active {
				width: 100%;
				left: 0;
				transform: translateX(0%);
				background-color: #0B5EB2;
			}
		}

		&:hover {
			color: #0B5EB2;
			background: rgba(255, 255, 255, 0.1);

			.app-tab-underline {
				width: 100%;
				left: 0;
				transform: translateX(0%);
			}
		}

		&.active {
			font-weight: bold;
			color: #0B5EB2;
			// border-bottom: 2px solid #01488B;

			.app-tab-underline {
				width: 100%;
				left: 0;
				transform: translateX(0%);
			}
		}
	}
}

// 鼠标悬停图片放大
.app-image-change-big {
	cursor: pointer;

	.img-box {
		overflow: hidden;
	}

	img {
		width: 100%;
		height: 100%;
		transition: .3s;
	}

	&:hover {
		img {
			transform: scale(1.2);
		}
	}
}

// 鼠标悬停背景加深
.app-box-change-back-dark {
	cursor: pointer;
	transition: 0.3s;

	&:hover {
		background: #9DBDDA !important;

		.textColor {
			color: #0f61ad !important;
		}
	}
}

// 鼠标悬停换背景
.app-box-change-back {
	cursor: pointer;
	transition: 0.3s;

	&:hover {
		// background: #F1F6FF !important;

		.textColor {
			color: #0B5EB1 !important;
		}
	}
}

// 导航页面标题
.app-page-title {
	background: #0f4e9b;
	background-image: url(@/assets/img/bottom-back.png);
	background-size: 100% auto;
	height: 150px;
	font-size: 30px;
	color: white;
	font-weight: bold;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}